<template>
	<view class="my-register page">
		<UserDate @changeUser='onChangeUser' @changeDate='onChangeDate'></UserDate>
		<view class="reminder" style="margin-top: 10rpx;">
			<view class="reminder-title">
				温馨提示
			</view>
			<view class="reminder-content">
				<view v-for="(item, index) in reminders" :key="item.key">
					{{(index+1) + '.' + item.label}}
				</view>
			</view>
		</view>
		<view class="my-register-main">
			<view v-for="(item,index) in listData" :key="index" class="card" style="margin-top: 10rpx;">
				<view class="title u-border-bottom">
					<view class="left">
						<text class="iconfont icon-baogaoguanli_huaban1"></text>
						<text>{{item.his_receipt_no||item.his_order_id}}</text>
					</view>
					<view class="right">
						<view class="btn">
							<u-button plain :hair-line='false' hover-class="none" :type='transStatus(item.pay_status)' size="mini">{{transStatusName(item.pay_status)}}</u-button>
						</view>
					</view>
				</view>
				<view class="main flexR">
					<view class="left">
						<view class="row"> <text>就诊人：</text>{{item.hzxm||userInfo.name}} </view>
						<!-- <view class="row"> <text>就诊序号：</text>{{item.yyhx}} </view> -->
						<view class="row" v-if="item.frontNum"> <text>等候人数：</text>{{item.frontNum}} </view>
						<view class="row"> <text>科室：</text>{{item.dept_name}} </view>
						<view class="row"> <text>专家：</text>{{item.doctor_name}} </view>
						<view class="row"> <text>就诊时间：</text>{{item.visit_time}} </view>
					</view>
					<view class="right" @click="toPage(item)">
						<u-icon name="arrow-right" color="#B5B5B5"></u-icon>
					</view>
				</view>
			</view>
			<u-empty text="暂无预约挂号信息" mode="list" v-if="!load&&listData.length===0"></u-empty>
		</view>
		<Load :load="load"></Load>
	</view>
</template>

<script>
	import UserDate from '@/components/UserInfo/user-date.vue'
	import Load from '@/components/Load/index.vue'
	import { getAllRegister } from '@/api/register.js'
	import { mapGetters } from 'vuex'
	import {defaultDate} from '@/common/js/default-date.js'
	export default {
		components:{ UserDate, Load },
		data() {
			return {
				value:0,
				load:true,
				reminders:[
					{
						label: '微信端退号只能退微信端的挂号',
						key:'reminder1'
					},
					{
						label: '微信端取消挂号后，退款金额会原路返回到账户',
						key:'reminder2'
					},
					{
						label: '等待人数只在当天有未就诊信息时显示',
						key:'reminder3'
					},
				],
				listData:[],
				queryDate:{}
			}
		},
		computed:{
			...mapGetters(['userInfo'])
		},
		async onLoad() {
			await this.$onLaunched
			this.queryDate = defaultDate
			this.initData()
		},
		methods: {
			initData(){
				if(!this.userInfo.patId){
					uni.navigateTo({
						url:'/pages/Login/addPatient'
					})
					return
				}
				let params = {
					// patid :this.userInfo.patId,
					identityCard: this.userInfo.idCard,
					...this.queryDate,
				}
				this.load = true;
				getAllRegister(params).then(data => {
					this.load = false
					this.listData = Array.isArray(data) ? data : []
				}).catch(e => {
					this.listData = []
					this.load = false
				})
			},
			transStatus(val){
        if(val=='0' || val ==1){
        	return 'default'
        }else if(val=='2' || val==5){
        	return 'error'
        }else if(val=='3' || val==6){
        	return 'success'
        }
			},
			transStatusName(val){
				// 预约未支付 warning 已挂号 success 已就诊 primary 已退号 error 
				// if(val=='0'){
				// 	return '已预约'
				// }else if(val=='1'){
				// 	return '就诊中'
				// }else if(val=='2'){
				// 	return '已退号'
				// }else if(val=='3'){
				// 	return '已挂号'
				// }else if(val=='4'){
				// 	return '已就诊'
				// }
        const status = {
          0: '待提交',
          1: '待支付',
          2: '支付取消',
          3: '支付成功',
          5: '已退号',
          6: '已就诊'
        }
        return status[val]
			},
			toPage(item){
				let res = JSON.stringify(item)
				uni.navigateTo({
					url:'/pages/Personal/Myregister/detail?params=' + res
				})
			},
			onChangeUser(){
				this.initData()
			},
			onChangeDate(val){
				this.queryDate = val
				this.initData()
			}
		}
	}
</script>

<style lang="scss" scoped>
	.my-register{
		.my-register-main{
			height: calc(100vh - 80rpx - 364rpx);
			overflow: scroll;
		}
	}
</style>